/**
 * Created by Administrator on 2017/4/1.
 */
import React,{Component} from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
    ScrollView
} from 'react-native'
var Dimensions = require('Dimensions');
var widowWidth = Dimensions.get('window').width;
class MyScrollView extends Component{
    renderChilds=()=>{
        var data=['red','green','blue','yellow','orange'];

        return data.map((item,i)=>{
            return <View key={`item${i}`} style={{height:200, width:widowWidth,backgroundColor:item,  }}   >
                <Text style={{ textAlign:'center',textAlignVertical :'center',flex:1, alignSelf:'center', backgroundColor:'#aa2233'}} >{i}</Text>

            </View>
        })

    }

    render(){
        return <ScrollView horizontal={true}
        pagingEnabled={true}>
            {this.renderChilds()}
        </ScrollView>
    }
}


module.exports = MyScrollView;